<script lang='ts' setup>
import MenuItemCom from './MenuItemCom.vue'
const props = withDefaults(defineProps<{ 'menuItem': any }>(), {
    menuItem: () => []
})

</script>
<template>
    <el-sub-menu :index="menuItem.path" 
    v-if="!menuItem.meta.hide && menuItem.children && menuItem.children.length > 0">
        <template #title>
            <el-icon v-if="menuItem.meta.icon">
                <component :is="menuItem.meta.icon" />
            </el-icon>
            <span>{{ menuItem.meta.title }}</span>
        </template>
        <menu-item-com :menuItem="item" v-for="item in menuItem.children" :key="item.path" />
    </el-sub-menu>
    <el-menu-item :index="menuItem.path" style=" justify-content: center"
        v-if="!menuItem.meta.hide && (!menuItem.children || menuItem.children.length == 0) && (menuItem.meta.type != 1)">
        <el-icon v-if="menuItem.meta.icon">
            <component :is="menuItem.meta.icon" />
        </el-icon>
        <template #title>{{ menuItem.meta.title }}</template>
    </el-menu-item>
</template>
<style scoped lang='scss'>
</style>